<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>美柚13333331</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="bootstrap-3.3.7-dist\css\bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="http://www.jq22.com/jquery/font-awesome.4.6.0.css">
    <link rel="stylesheet" type="text/css" href="master.css">
    <!-- <link rel="stylesheet" type="text/css" href="bootsnav.css"> -->
    <script src="jquery-3.2.1.js"></script>
    <script src="bootstrap-3.3.7-dist\js\bootstrap.min.js"></script>
    <script type="text/javascript" src="bootsnav.js"></script>

</head>

<body>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-4" style="text-align: center;">
                <img src="images/10.png" alt="">
            </div>
            <div class="col-xs-8">
                <div class="container">
                    <div class="row">
                        <div class="col-xs-12">
                            <nav class="navbar navbar-default navbar-mobile bootsnav">
                                <div class="navbar-header">
                                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#navbar-menu">
                                        <i class="fa fa-bars"></i>
                                    </button>
                                </div>
                                <div class="collapse navbar-collapse" id="navbar-menu">
                                    <ul class="nav navbar-nav" data-in="fadeInDown" data-out="fadeOutUp">
                                        <li>
                                            <a href="#">首页</a>
                                        </li>
                                        <li>
                                            <a href="#">资讯</a>
                                        </li>
                                        <li>
                                            <a href="#">美柚号</a>
                                        </li>
                                        <li class="dropdown">
                                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">美柚概况</a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="#">公司概况</a>
                                                </li>
                                                <li>
                                                    <a href="#">创始人</a>
                                                </li>
                                                <li>
                                                    <a href="#">美柚大事记</a>
                                                </li>
                                                <li>
                                                    <a href="#">团队介绍</a>
                                                </li>
                                                <li>
                                                    <a href="#">福利待遇</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li class="dropdown">
                                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">美柚产品</a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="#">美柚</a>
                                                </li>
                                                <li>
                                                    <a href="#">柚宝宝</a>
                                                </li>

                                                <li>
                                                    <a href="#">柚子街</a>
                                                </li>
                                                <li>
                                                    <a href="#">返还购</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li class="dropdown">
                                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">招商合作</a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="#">女人通平台</a>
                                                </li>
                                                <li>
                                                    <a href="#">媒体合作平台</a>
                                                </li>

                                                <li>
                                                    <a href="#">电商合作</a>
                                                </li>
                                            </ul>
                                        </li>
                                        <li class="dropdown">
                                            <a href="#" class="dropdown-toggle" data-toggle="dropdown">联系我们</a>
                                            <ul class="dropdown-menu">
                                                <li>
                                                    <a href="#">联系我们</a>
                                                </li>
                                                <li>
                                                    <a href="#">加入我们</a>
                                                </li>

                                                <li>
                                                    <a href="#">电商合作</a>
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 轮播图开始 -->
    <div id="slideshow">
        <!-- 插入轮播的图片们 -->
        <img src="images/6.png" />
        <img src="images/7.png" />
        <img src="images/8.png" />
        <img src="images/9.png" />
    </div>
    <!-- 轮播图结束 -->
    <div class="cont">
        <div class="row cone">
            <div class="col-xs-8 col-md-8 cone-paging">
                <div class="col-xs-6 jz">美柚动态</div>
                <div class="col-xs-6">
                    <a href="#" class="gd">更多</a>
                </div>
                <ul class="list-unstyled main">
                    <li>
                        <a href="#">Fighting Five —— 记2017美柚中秋博饼宴</a>
                    </li>
                    <li>
                        <a href="#">美柚CEO陈方毅第三次登上《财富》商界</a>
                    </li>
                    <li>
                        <a href="#">用大数据读懂女人心 美柚潜心耕耘女儿国</a>
                    </li>
                    <li>
                        <a href="#">美柚入选中国互联网百强</a>
                    </li>
                    <li>
                        <a href="#">美柚获第六届中国财经峰会双项大奖</a>
                    </li>
                    <li>
                        <a href="#">美柚：双平台+全生态，抢占母婴行业市场</a>
                    </li>
                    <li>
                        <a href="#">第五届TopDigital创新奖揭晓，美柚斩获</a>
                    </li>
                    <li>
                        <a href="#">​美柚荣获2017移动互联网行业最具领导力奖</a>
                    </li>
                </ul>
            </div>
            <div class="col-xs-8 col-md-8 cone-paging">
                <div class="col-xs-6 ja">美柚家族</div>
                <div class="col-xs-6"></div>
                <a href="#" class="gd">更多</a>
                <div class="photo">
                    <div class="photo-s">
                        <a href="#">
                            <img src="images/11.png" alt="..." class="img-rounded">
                            <h3>美柚</h3>
                        </a>
                        <a href="#">
                            <img src="images/12.png" alt="..." class="img-rounded">
                            <h3>柚宝宝</h3>
                        </a>
                    </div>
                    <div class="photo-s">
                        <a href="#">
                            <img src="images/13.png" alt="..." class="img-rounded">
                            <h3>柚子街</h3>
                        </a>
                        <a href="#">
                            <img src="images/14.png" alt="..." class="img-rounded">
                            <h3>返还购</h3>
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-xs-8 col-md-8 cone-p">
                <div class="col-xs-6 jz">知识</div>
                <div class="col-xs-6">
                    <a href="#" class="gd">更多</a>
                </div>
                <ul class="list-unstyled main">
                    <li>
                        <a href="#">三丝鸡脯肉，补充蛋白质</a>
                    </li>
                    <li>
                        <a href="#">宝宝补血食谱：鸭血豆腐汤</a>
                    </li>
                    <li>
                        <a href="#">橙香小排，改善宝宝挑食</a>
                    </li>
                    <li>
                        <a href="#">宝宝清火食谱：芹菜拌腐竹</a>
                    </li>
                    <li>
                        <a href="#">宝宝补血食谱：绿豆猪肝粥</a>
                    </li>
                    <li>
                        <a href="#">宝宝秋季宜吃水果盘点</a>
                    </li>
                    <li>
                        <a href="#">番茄胡萝卜汤，宝宝明目佳品</a>
                    </li>
                    <li>
                        <a href="#">妈妈如何让孩子健康吃火锅</a>
                    </li>
                </ul>
            </div>
        </div>
        <div class="conten">
            <div class="row conten-l">
                <div class="col-md-1 my">关于我们

                    <ul>
                        <li>
                            <a href="#">关于我们</a>
                        </li>
                        <li>
                            <a href="#">联系我们</a>
                        </li>
                        <li>
                            <a href="#">加入我们</a>
                        </li>
                    </ul>
                </div>
                <div class="col-md-1 my">商务合作

                    <ul>
                        <li>
                            <a href="#">广告合作</a>
                        </li>
                        <li>
                            <a href="#">电商合作</a>
                        </li>
                    </ul>
                </div>
                <div class="col-md-1 my">关注我们

                    <ul>
                        <li>
                            <a href="#">新浪微博</a>
                        </li>
                    </ul>
                </div>
                <div class="col-md-1 my">美柚微信
                    <img src="images\15.png" alt="">
                </div>
                <div class="col-md-1 my">下载美柚

                    <img src="images\15.png" alt="">
                </div>
            </div>
        </div>
        <p class="text-center">
            <a href="#">增值电信业务经营许可证 闽B2-20140056</a>
        </p>
        <ul class="list-inline">
            <li>
                <a href="#">美柚</a>
            </li>
            <b>|</b>
            <li>
                <a href="#">美柚</a>
            </li>
            <b>|</b>
            <li>
                <a href="#">美柚</a>
            </li>
            <b>|</b>
            <li>
                <a href="#">美柚</a>
            </li>
            <b>|</b>
            <li>
                <a href="#">美柚</a>
            </li>
        </ul>
        <ul class="list-inline">
            <li>
                <a href="#">公司名称：厦门美柚信息科技有限公司</a>
            </li>
            <li>
                <a href="#">联系地址：福建省厦门市思明区软件园二期望海路4号楼</a>
            </li>
        </ul>
        <ul class="list-inline">
            <li>
                <a href="#">闽ICP备13020990号-5</a>
            </li>
            <li>
                <a href="#">闽公网安备 35020302000042号</a>
            </li>
            <li>
                <a href="#">Copyright © 2017 Meetyou. 保留所有权利</a>
            </li>
        </ul>
        <div class="foot">
            <img src="images\16.png" alt="">
            <img src="images\20.jpg" alt="">
        </div>
    </div>
    </div>
    </div>
</body>
<script>
    $(document).ready(function() {
        $(".flip").each(function(o) {
            $(this).mouseover(function() {
                $(this).find(".panel").slideDown("fast");
            });
            $(this).mouseleave(function() {
                $(this).find(".panel").slideUp("fast");
            });
        });
    });
    //---------主角：轮播图函数-------------
    function slideshow() {
        var slideshow = document.getElementById("slideshow"),
            imgs = slideshow.getElementsByTagName("img"), //得到图片们
            current = 0; //current为当前活跃的图片编号
        function slideOff() {
            imgs[current].className = ""; //图片淡出
        }

        function slideOn() {
            imgs[current].className = "active"; //图片淡入
        }

        function changeSlide() { //切换图片的函数
            slideOff(); //图片淡出
            current++; //自增1
            if (current >= 3) current = 0;
            slideOn(); //图片淡入
        }
        //每2s调用changeSlide函数进行图片轮播
        var slideon = setInterval(changeSlide, 3000);
    }
    slideshow();
</script>

</html>